//const和let定义的变量所在的那一层作用域如果有花括号，则该变量会因为块级作用域而成为局部变量，用var声明的变量则不会有块级作用域的影响。

import adminListView from '$v/adminList';

import {
    addAdminRequest,
    adminListRequest,
    deleteAdminRequest
} from "$a/admin"

// 封装展示所有管理员列表的功能函数，当初始化的时候，添加的时候，删除的时候都要执行。
const showAdminList = async (res) => {
    // 只要进入当前路由函数，则立马开始查询所有的管理员信息 （在渲染管理员列表页面之前先发请求给数据库获取数据）
    let adminListResult = null;
    try { //const定义的变量所在的那一层作用域如果有花括号，则该变量会因为块级作用域而成为局部变量。
        adminListResult = await adminListRequest(); //右边函数调用发送ajax请求，经过响应拦截得到response.data.data（响应报文.响应体.响应体中的data属性也就是后端返回给我们的管理人员的数据，即是数据库查询到的管理人员的信息findResult）是个数组，管理人员的所有信息都在这个数组中。  //右边发送请求后，整体表达式的返回值就是后端发送给我们的数据。
        // console.log(adminListResult);    //所以这个返回值就是  response.data.data  （即管理人员的名字，id，密码等信息）              
    } catch (e) {
        alert('获取管理员列表异常' + e.message)
    }

    // 渲染二级路由视图  (初始化，重新渲染页面由于在await后面，变成异步代码了，下方获取元素添加点击事件是同步的，会获取不到元素)
    res.render(adminListView({
        adminList: adminListResult //adminListResult是局部变量，这里无法使用，需要修改为全局的
    }))
}

export default async (req, res) => {
    // 调用函数，展示管理员列表  （传入res作为参数使用）
    await showAdminList(res); //要在这里加个await，意思是等这里面的都执行完了（包括要执行完渲染二级路由视图之后）再向下走

    // 添加点击保存按钮添加管理员
    const oSaveAdminBtn = document.getElementById('saveAdminBtn')
    // 使用事件委托绑定事件
    document.onclick = async function (e) { //重新渲染之后没有给元素重新绑定事件，也就是重新渲染页面后，saveAdminBtn按钮不再是之前那个按钮了，而新的saveAdminBtn按钮是没有绑定事件的。
        // 要判断当前点击的一定是保存按钮 添加管理员逻辑
        if (e.target.id === "saveAdminBtn") {
            // 可以通过表单元素的name属性获取元素，不需要再用document.getElementById等方法获取元素。
            // console.log(document.adminForm);  //document.adminForm通过name获取表单元素
            // console.log(document.adminForm.adminName);
            // console.log(document.adminForm.password);
            // console.log(document.adminForm.rePassword);

            // 获取用户输入的内容
            const adminNameValue = document.adminForm.adminName.value.trim(); //(内容不能为空,在获取值的时候提前排除空字符串)
            const passwordValue = document.adminForm.password.value.trim();
            const rePasswordValue = document.adminForm.rePassword.value.trim();

            // 判断所有的输入内容不能为空
            if (!adminNameValue || !passwordValue || !rePasswordValue) { //如果adminNameValue为空（adminNameValue就是false），非它!adminNameValue 就是true
                return alert("输入内容不能为空")
            }

            // 判读输入的密码是否一致
            if (passwordValue !== rePasswordValue) {
                return alert("两次输入的密码不一致")
            }

            // 向后端发送请求（发送添加管理员请求）
            try {
                await addAdminRequest({ //调用函数，传递一个实参，该实参是个对象
                    adminName: adminNameValue,
                    password: passwordValue,
                    regTime: new Date().toLocaleString()
                });

                alert("添加成功")

                // 添加成功之后自动关闭添加窗口 (手动触发某个元素上的点击事件)
                document.getElementById('closeAdd').click();
                // 清空表单
                document.adminForm.reset();

                // 添加成功之后重新渲染页面
                showAdminList(res); //可以不加await，因为到这里已经是最后一个了
            } catch (e) {
                alert("有异常" + e.message)
                // 如果注册的时候有异常，窗口可以不关，但是要自动清空表单
                document.adminForm.reset();
            }
        }

        // 删除管理员逻辑
        if (e.target.nodeName === "BUTTON" && e.target.parentNode.nodeName === "TD") {
            // 获取当前删除按钮对应的adminName（在生成删除按钮的时候就把自定义属性设置上去）
            const adminName = e.target.dataset.adminname; //注意这里元素的属性都会转为小写。
            // 发送删除请求   
            try {
                await deleteAdminRequest(adminName); //参数传当前点击所在的管理员账号名称(当前删除按钮对应的adminName)
                alert("删除管理员"+adminName+"成功")

                // 删除成功之后重新渲染视图
                showAdminList(res); 
            } catch (e) {
                alert("删除管理员"+adminName+"异常")
            }
        }

    }
}